<template>
  <a-modal
    :title="'审批记录'"
    :visible="true"
    width="60%"
    :footer="null"
    @cancel="reset"
  >
    <a-table
      bordered
      :columns="columns"
      :rowKey="record => record.id"
      :data-source="dataSource"
      :scroll="{ x: true }"
    >
      <span
        slot="states"
        slot-scope="txt,record"
      >
        <span v-if="record.examineStatus == 10">通过</span>
        <span v-if="record.examineStatus == 20">不通过</span>
        <span v-if="record.examineStatus == 30">系统重置</span>
        <span v-if="record.examineStatus != 10 && record.examineStatus != 20 && record.examineStatus != 30">{{record.examineStatus}}</span>
      </span>
    </a-table>
  </a-modal>
</template>

<script>
const columns = [
  {
    title: '审核人姓名',
    dataIndex: 'name'
  },
  {
    title: '审核状态',
    scopedSlots: { customRender: 'states' }
  },
  {
    title: '审核意见',
    dataIndex: 'examineRemark'
  },
  {
    title: '审核时间',
    dataIndex: 'examineDate'
  }
]
import { getExamineHistory } from '@api/pattern/index.js'

export default {
  props: {
    patternId: {
      type: [Number, String],
      default: ''
    },
    ifTag: {
      type: [Number, String],
      default: ''
    }
  },

  data() {
    return {
      columns,
      dataSource: []
    }
  },

  computed: {
    jobNumber() {
      return this.$store.getters.userInfo.workNo || ''
    }
  },

  created() {
    console.log(this.ifTag)
    if (this.ifTag == 1) {
      this.loadTag()
    } else {
      this.loadData()
    }
  },

  methods: {
    // handleTableChange(pagination) {
    //   this.pagination = pagination
    //   this.loadData()
    // },
    async loadTag() {
      const data = {
        jobNumber: this.jobNumber,
        tag: '法务'
      }
      if (this.patternId) {
        data.patternId = this.patternId
        const res = await getExamineHistory('/tag', data)
        if (res.code == 200) {
          this.dataSource = res.data
        } else {
          this.$message.error(res.msg || res.message)
        }
      } else {
        this.$message.error('无数据！')
      }
    },
    async loadData() {
      const data = {
        jobNumber: this.jobNumber
      }
      if (this.patternId) {
        data.patternId = this.patternId
        const res = await getExamineHistory('', data)
        if (res.code == 200) {
          this.dataSource = res.data
        } else {
          this.$message.error(res.msg || res.message)
        }
      } else {
        this.$message.error('无数据！')
      }
    },
    reset() {
      this.$emit('closeHistory')
    }
  }
}
</script>

<style scoped lang="less">
.info-action {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  // margin-bottom: 20px;
}
.ml-20 {
  margin-left: 20px;
}
.poster {
  width: 100px;
  height: 100px;
  margin-right: 20px;
  position: relative;
  &:hover {
    .img-modal {
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }
  .img {
    width: 100%;
    height: 100%;
  }
  .img-modal {
    background-color: rgba(0, 0, 0, 0.5);
    display: none;
    position: absolute;
    color: #fff;
    font-size: 20px;
    width: 100%;
    top: 0;
    height: 100%;
    left: 0;
  }
}
.fileList {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
}
.tips {
  margin-left: 5px;
  cursor: pointer;
}
</style>
